<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
	  xmlns:rich="http://richfaces.org/rich"
	  xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>MailAdmin</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="${request.contextPath}/resources/css/main.css" />
</h:head>

<h:body>
<h:form id="form" >
<div id="maincontainer">
	<div id="topsection">
		HEADER
	</div>
	<div id="contentwrapper" >
		<div id="contentcolumn">
			<h:panelGroup id="buscarPanelId" rendered="#{menuBean.paginaActul == 'buscarMateria'}">	
				<h:panelGrid id="filtroMateriaPanelGridId" columns="2">
					<h:outputLabel value="Codigo" />
					<h:inputText value="#{materiaBean.materiaFiltro.codigo}" />
					<h:outputLabel value="Materia" />
					<h:inputText value="#{materiaBean.materiaFiltro.nombre}" />
					<h:outputLabel value="Email" />
					<h:inputText value="#{materiaBean.materiaFiltro.email}" />
				</h:panelGrid>
		
				<h:panelGrid id="controlPanleGridid" columns="1" width="100%" style="text-align:center">	
					<a4j:commandButton id="buscarCommandButton" value="Buscar" actionListener="#{materiaBean.onBuscar}" render="buscarPanelId" execute="buscarPanelId" />
				</h:panelGrid>
				
				<h:panelGrid id="materiasPanleGridId" width="100%" style="text-align:center">
					<rich:dataTable id="materiasDataTableId" style="width:100%" rows="5"
							value="#{materiaBean.materiasFiltradas}" var="unaMateria">
						<rich:column width="25%">
							<f:facet name="header">Codigo</f:facet>
							<h:outputText value="#{unaMateria.codigo}" />
						</rich:column>
						<rich:column width="25%">
							<f:facet name="header">Materia</f:facet>
							<h:outputText value="#{unaMateria.nombre}" />
						</rich:column>
						<rich:column width="25%">
							<f:facet name="header">Email</f:facet>
							<h:outputText value="#{unaMateria.email}" />
						</rich:column>
						<rich:column width="25%">
							<h:outputLabel id="accionLabelId" value="Acción" styleClass="contextMenu"/>
							<rich:contextMenu target="accionLabelId" mode="ajax" showEvent="click"> 
					            <rich:menuItem label="Cargar TP" oncomplete="#{rich:component('cargarTpPopUpId')}.show()" action="#{materiaBean.onCrearTp}">
					            	<f:setPropertyActionListener value="#{unaMateria}" target="#{materiaBean.materiaSeleccionada}" />
					            </rich:menuItem>
					            <rich:menuItem label="Ver TPs" oncomplete="#{rich:component('vetTpsPopUpId')}.show()" action="#{materiaBean.onCargarTps}">
					            	<f:setPropertyActionListener value="#{unaMateria}" target="#{materiaBean.materiaSeleccionada}" />
					            </rich:menuItem>
								<rich:menuItem label="Editar"  actionListener="#{menuBean.onEditarMateria}" render="@all">
					            	<f:setPropertyActionListener value="#{unaMateria}" target="#{materiaBean.materiaSeleccionada}" />
					            </rich:menuItem>
					        </rich:contextMenu>
						</rich:column>
					</rich:dataTable>
					<rich:dataScroller for="materiasDataTableId" maxPages="5" renderIfSinglePage="false"/>
				</h:panelGrid>
			</h:panelGroup>
			
			<h:panelGroup id="altaPanelId" rendered="#{menuBean.paginaActul == 'altaMateria'}">
				<h:messages id="mensajesId"/>
				
				<h:panelGrid id="altaMateriaPanelGridId" columns="2">
					<h:outputLabel value="Codigo" />
					<h:inputText label="Codigo" value="#{materiaBean.materiaAlta.codigo}" required="true" maxlength="5"/>
					<h:outputLabel value="Materia" />
					<h:inputText label="Materia" value="#{materiaBean.materiaAlta.nombre}" required="true" maxlength="100"/>
					<h:outputLabel value="Email" />
					<h:inputText label="Email" value="#{materiaBean.materiaAlta.email}" required="true" maxlength="50" validatorMessage="Email inválido">
						 <f:validateRegex pattern="^(.+\@.+\..+)$" ></f:validateRegex>
					</h:inputText>
					<h:outputLabel value="Host (POP3 o IMAP)" />
					<h:inputText label="Host" value="#{materiaBean.materiaAlta.host}" required="true" maxlength="50"/>					
					<h:outputLabel value="Clave" />
					<h:inputSecret label="Clave" value="#{materiaBean.materiaAlta.password}" required="true" maxlength="50"/>
					<h:outputLabel value="Smtp Host" />
					<h:inputText label="Smtp Host" value="#{materiaBean.materiaAlta.smtpHost}" required="true" maxlength="50"/>
					<h:outputLabel value="Smtp Port" />
					<h:inputText label="Smtp Port" value="#{materiaBean.materiaAlta.smtpPort}" required="true" maxlength="50"/>
				</h:panelGrid>
		  
				<h:panelGrid id="controAltalPanleGridid" columns="1" width="100%" style="text-align:center">	
					<a4j:commandButton id="altaCommandButton" value="Guardar" actionListener="#{materiaBean.onAlta}" render="altaPanelId" execute="altaPanelId" />
				</h:panelGrid>
			</h:panelGroup>
			
			<h:panelGroup id="editarPanelId" rendered="#{menuBean.paginaActul == 'editarMateria'}">
				<h:messages id="eitarMensajesId"/>
				
				<h:panelGrid id="editarMateriaPanelGridId" columns="2">
					<h:outputLabel value="Codigo" />
					<h:inputText label="Codigo" value="#{materiaBean.materiaSeleccionada.codigo}" required="true" maxlength="5"/>
					<h:outputLabel value="Materia" />
					<h:inputText label="Materia" value="#{materiaBean.materiaSeleccionada.nombre}" required="true" maxlength="100"/>
					<h:outputLabel value="Email" />
					<h:inputText label="Email" value="#{materiaBean.materiaSeleccionada.email}" required="true" maxlength="50" validatorMessage="Email inválido">
						 <f:validateRegex pattern="^(.+\@.+\..+)$" ></f:validateRegex>
					</h:inputText>
					<h:outputLabel value="Host (POP3 o IMAP)" />
					<h:inputText label="Host" value="#{materiaBean.materiaSeleccionada.host}" required="true" maxlength="50"/>					
					<h:outputLabel value="Clave" />
					<h:inputSecret label="Clave" value="#{materiaBean.materiaSeleccionada.password}" required="true" maxlength="50"/>
					<h:outputLabel value="Smtp Host" />
					<h:inputText label="Smtp Host" value="#{materiaBean.materiaAlta.smtpHost}" required="true" maxlength="50"/>
					<h:outputLabel value="Smtp Port" />
					<h:inputText label="Smtp Port" value="#{materiaBean.materiaAlta.smtpPort}" required="true" maxlength="50"/>
				</h:panelGrid>
		  
				<h:panelGrid id="controlEditarPanleGridid" columns="1" width="100%" style="text-align:center">	
					<a4j:commandButton id="editarCommandButton" value="Guardar" actionListener="#{materiaBean.onEditarMateria}" render="editarPanelId" execute="editarPanelId" />
				</h:panelGrid>
			</h:panelGroup>
		</div>		
	</div>

	<div id="leftcolumn">
		<rich:panelMenu id="panelMenuId" mode="ajax" style="width:200px" >
	        <rich:panelMenuGroup label="Materias" expanded="true">
	        	<rich:panelMenuItem id="altaMateriaMenuItem" label="Alta" actionListener="#{menuBean.onAltaMateria}" render="@all"/>
            	<rich:panelMenuItem id="buscarMateriaMenuItem" label="Buscar" actionListener="#{menuBean.onBuscarMateria}" render="@all"/>
            </rich:panelMenuGroup>
	    </rich:panelMenu>    
	</div>

	<div id="footer">
		Tecnicas de Diseño
	</div>
	
	<rich:popupPanel id="cargarTpPopUpId" width="300" height="180">
		<f:facet name="header">
            <h:outputText value="Nuevo trabajo practico" />
        </f:facet>
		<a4j:outputPanel ajaxRendered="true">
	     	<h:panelGrid columns="2" id="cargarTpPanelGridId">
	     		<h:outputLabel value="Materia" />
				<h:inputText value="#{materiaBean.nuevoTrabajoPractico.claveTrabajoPractivo.materia.nombre}" readonly="true"/>
				<h:outputLabel value="Año" />
				<h:inputText value="#{materiaBean.nuevoTrabajoPractico.claveTrabajoPractivo.cuatrimestre.anio}" readonly="true"/>
				<h:outputLabel value="Cuatrimestre" />
				<h:inputText value="#{materiaBean.nuevoTrabajoPractico.claveTrabajoPractivo.cuatrimestre.cuatrimestre}" readonly="true"/>
				<h:outputLabel value="Nro Tp" />
				<h:inputText value="#{materiaBean.nuevoTrabajoPractico.claveTrabajoPractivo.numeroTp}" readonly="true"/>
			</h:panelGrid>
			<h:panelGrid columns="2" width="100%" style="text-align:center">
				<h:panelGroup>	
					<a4j:commandButton value="Confirmar" oncomplete="#{rich:component('cargarTpPopUpId')}.hide()" actionListener="#{materiaBean.onGuardarTp}" execute="cargarTpPanelGridId"/>
					<a4j:commandButton value="Cancelar" onclick="#{rich:component('cargarTpPopUpId')}.hide()" />
				</h:panelGroup>
			</h:panelGrid>
		</a4j:outputPanel> 
    </rich:popupPanel>
    
    <rich:popupPanel id="vetTpsPopUpId" width="500" height="300">
		<f:facet name="header">
            <h:outputText value="Trabajos Prácticos" />
        </f:facet>
		<a4j:outputPanel ajaxRendered="true">
	     	<h:panelGrid columns="2">
	     		<h:outputLabel value="Codigo" />
				<h:inputText value="#{materiaBean.materiaSeleccionada.codigo}" readonly="true"/>
	     		<h:outputLabel value="Materia" />
				<h:inputText value="#{materiaBean.materiaSeleccionada.nombre}" readonly="true"/>
			</h:panelGrid>
			<h:panelGrid width="100%" style="text-align:center" >
				<rich:dataTable id="tpsId" style="width:100%" value="#{materiaBean.trabajosPracticos}" var="unaTP" rows="5">
					<rich:column width="25%">
						<f:facet name="header">Materia</f:facet>
						<h:outputText value="#{unaTP.claveTrabajoPractivo.materia.nombre}" />
					</rich:column>
					<rich:column width="25%">
						<f:facet name="header">Año</f:facet>
						<h:outputText value="#{unaTP.claveTrabajoPractivo.cuatrimestre.anio}" />
					</rich:column>
					<rich:column width="25%">
						<f:facet name="header">Cuatrimestre</f:facet>
						<h:outputText value="#{unaTP.claveTrabajoPractivo.cuatrimestre.cuatrimestre}" />
					</rich:column>
					<rich:column width="25%">
						<f:facet name="header">Nro TP</f:facet>
						<h:outputText value="#{unaTP.claveTrabajoPractivo.numeroTp}" />
					</rich:column>
				</rich:dataTable>
				<rich:dataScroller for="tpsId" maxPages="5" renderIfSinglePage="false"/>
			</h:panelGrid>			
			<h:panelGrid columns="2" width="100%" style="text-align:center">	
				<a4j:commandButton value="Salir" onclick="#{rich:component('vetTpsPopUpId')}.hide()" />
			</h:panelGrid>
		</a4j:outputPanel> 
    </rich:popupPanel>
 
</div>        
</h:form>	
</h:body>
</html>